<template>
	<div id='app'>
		<div id="login_new" class="inp">
			<div class="fill_word">
				<p>
					用户名
				</p>
				<div class="phone">
					<div class="am-form-group">
						<input type="text" name="user" id="user" v-model="fd.name" placeholder="请输入用户名"
							onblur="check('user','用户名不能为空！')" />
						<div align="right">
							<span id="userspan"></span>
						</div>
					</div>
					<div class="clear"></div>
				</div>
				<p>
					密码
				</p>
				<div class="phone">
					<div class="am-form-group">
						<input type="password" name="password" id="password" v-model="fd.pwd" placeholder="请输入六位包含字母和数字的密码"
							onblur="validate_password(this.value)" />
						<div align="right" id="test_pw"></div>
					</div>
					<div class="clear"></div>
				</div>
				<p>
					再次输入密码
				</p>
				<div class="phone">
					<div class="am-form-group">
						<input type="password" name="password2" id="password2" placeholder="请再次确认密码"
							onblur="validate_password2(this.value)" />
						<div align="right" id="is_test_pw"></div>
					</div>
					<div class="clear"></div>
				</div>
				<p>
					邮箱
				</p>
				<div class="phone">
					<div class="am-form-group">
						<input type="text" name="email" id="email" v-model="fd.email" placeholder="请输入邮箱"
							onblur="validate_email(this.value)" />
						<div align="right" id="test_email"></div>
					</div>
					<div class="clear"></div>
				</div>
				<p>
					手机号
				</p>
				<div class="phone">
					<div class="am-form-group">

						<input type="text" name="input" v-model="fd.phone" placeholder="请输入手机号"
							onblur="validate_phone(this.value)" />
						<div align="right" id="test_phone"></div>
					</div>
					<div class="clear"></div>
				</div>
				 <!-- <view class="uni-title uni-common-pl">密保问题</view> -->
				 <p>密保问题</p>
				        <view class="uni-list">
				            <view class="uni-list-cell">
				                <view class="uni-list-cell-db">
				                    <picker @change="bindPickerChange" :value="fd.problem" :range="questions">
				                        <view class="uni-input">{{questions[fd.problem]}}</view>
				                    </picker>
				                </view>
				            </view>
				        </view>
				<div class="fill_num">
					<div class="fill am-form-group">
						<input type="text" name="input" v-model="fd.answer" placeholder="请输入密保答案 " />
					</div>
					<div class="clear"></div>
				</div>
				<div style="text-align:center">
					<input align="center" type="submit" @click="submit()" class="yes" value="注册"
						style="background-color:#8abcd1;border: 1px solid #3b818c;border-radius: 10px;"> </input>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import config from '@/config'
	export default {
		data() {
			return {
				usr: '',
				pwd: '',
				questions:[
					'点击此处选择密保问题',
					'您的姓名是？',
					'您配偶的生日是？',
					'您的学号（或工号）是？',
					'您母亲的生日是？',
					'您高中班主任的名字是？',
					'您父亲的姓名是？',
					'您小学班主任的名字是？',
					'您父亲的生日是？',,
					'您配偶的姓名是？',
					'您初中班主任的名字是？',
					'您初中班主任的名字是？',
					'您最熟悉的童年好友名字是？'
				],
				fd: {
					name: "",
					pwd: "",
					phone: "",
					email: "",
					problem:0,
					answer: ""
				}
			}
		},
		methods: {
			bindPickerChange:function(e){
				this.fd.problem = e.detail.value;
			},
			submit: function() {
				uni.request({
					url: `${config.baseUrl}/reg`,
					method: 'POST',
					data: this.fd,
					success(r) {
						if (r.data.succ) {
							uni.navigateTo({
								url: 'login'
							})
						}
					},
					complete(res){
						if(res.data && res.data.msg){
							uni.showToast({
								icon:'none',
								title:res.data.msg
							})
						}
					},
				})
			},
		}
	}
</script>

<style>
</style>
